<template>
	<view class="addwrapper">
		<textarea class="textarea" ref="textarea" :value="text" @input="onInput" placeholder="请输入您的常用回复" hold-keyboard confirm-type="send"  :maxlength="-1" />
		
		<view class="addBox" v-if="!isedit">
			<view class="addcyy" @tap="submit" >
				确认添加
			</view>			
		</view>
		<view class="buttonBox" v-else>
			<view class="edit button" @tap="submitEdit">
				确认修改
			</view>
			<view class="del button"  @tap="submitDel">
				删除
			</view>
		</view>
	</view>
</template>

<script>
	import api from '@/common/api.js'
	import {
		req
	} from '@/common/vmeitime-http/'
	export default {
		data() {
			return {
				text:'',
				isedit:false,
				id:''
			}
		},
		onLoad(e) {
			if(e.type){
				this.isedit=true
				this.id = e.id
				this.getinfo(e.id)
			}
		},
		methods: {
			onInput(event){
				this.text = event.detail.value;
			},
			getinfo(id){
				req('GET',api.getcyyByid,{id}).then(e=>{
					this.text = e.result.title
				})
			},
			submit(){
				const par = {
					title:this.text,
				}
				console.log(par.title);
				req('POST',api.addcyy,par).then(e=>{
					uni.navigateBack()
				})
			},
			submitEdit(){
				const par ={
					id:this.id,
					title:this.text
				}
				req('POST',api.editcyy,par).then(e=>{
					uni.navigateBack()
				})
			},
			submitDel(){
				req('DELETE',api.delcyy,{id:this.id}).then(e=>{
					uni.navigateBack()
				})
			}
		}
	}
</script>

<style lang="scss" scoped> 
.addwrapper{
	width: 100%;
	height: 100%;
	position: relative;
	.textarea{
		width: 80%;
		height: 30%;
		border: 1px solid #3333  !important;
		margin: 10px auto;
	}
	.addBox{
		width: 100%;
		background-color: #fff;
		position: absolute;
		bottom: 0;
		left: 0;
		.addcyy{
			width: fit-content;
			margin: 0 auto;
			padding: 10px 20px;
			border: 1px solid #333;
			border-radius: 8px;
			margin-bottom: 10px;
		}
	}
	.buttonBox{
		width: 100%;
		background-color: #fff;
		position: absolute;
		bottom: 0;
		left: 0;
		display: flex;
		justify-content: center;
		.button{
			width: fit-content;
			padding: 10px 20px;
			border: 1px solid #333;
			border-radius: 8px;
			margin-bottom: 10px;
		}
		.del{
			margin-left: 10px;
		}
	}
}
</style>
